package com.xuexiang.xuidemo.slice.guideview;

import com.xuexiang.xui_lib.component.guidview.FocusShape;
import com.xuexiang.xui_lib.component.guidview.GuideCaseView;
import com.xuexiang.xuidemo.ResourceTable;
import com.xuexiang.xuidemo.slice.BaseAbilitySlice;

import ohos.agp.animation.Animator;
import ohos.agp.animation.AnimatorProperty;
import ohos.agp.components.Component;
import ohos.agp.components.ComponentContainer;
import ohos.agp.utils.Color;
import ohos.agp.utils.TextAlignment;

public class GuideCaseViewStyleAbilitySlice extends BaseAbilitySlice implements Component.ClickedListener {

    ComponentContainer rootLayout;

    @Override
    protected int getUIContentLayoutId() {
        return ResourceTable.Layout_guidecase_style_slice;
    }

    @Override
    protected int getTitleBarId() {
        return ResourceTable.Id_title_bar;
    }

    @Override
    protected void initComponents() {
        super.initComponents();
        rootLayout = (ComponentContainer) findComponentById(ResourceTable.Id_guide_style_layout);
        findComponentById(ResourceTable.Id_btn_nofocus).setClickedListener(this);
        findComponentById(ResourceTable.Id_btn_rounded_rect).setClickedListener(this);
        findComponentById(ResourceTable.Id_btn_large_circle).setClickedListener(this);
        findComponentById(ResourceTable.Id_btn_rect_position).setClickedListener(this);
        findComponentById(ResourceTable.Id_btn_background_color).setClickedListener(this);
        findComponentById(ResourceTable.Id_btn_no_anim).setClickedListener(this);
        findComponentById(ResourceTable.Id_btn_custom_anim).setClickedListener(this);
        findComponentById(ResourceTable.Id_btn_custom_view).setClickedListener(this);
    }

    public void noFocus() {
        new GuideCaseView.Builder(getAbility())
            .picture(ResourceTable.Media_img_guidecaseview_gain_speed_gesture)
            .root(rootLayout)
            .build()
            .show();
    }

    public void roundedRectFocus(Component view) {
        new GuideCaseView.Builder(getAbility())
            .focusOn(view)
            .title("这是圆角矩形聚焦框")
            .root(rootLayout)
            .focusShape(FocusShape.ROUNDED_RECTANGLE)
            .roundRectRadius(90)
            .build()
            .show();
    }

    public void focusWithLargerCircle(Component view) {
        new GuideCaseView.Builder(getAbility())
            .focusOn(view)
            .root(rootLayout)
            .focusCircleRadiusFactor(1.5)
            .title("一个巨大的圆形聚焦")
            .focusBorderColor(Color.GREEN)
            .titleStyle(0, TextAlignment.BOTTOM | TextAlignment.HORIZONTAL_CENTER)
            .build()
            .show();
    }

    public void focusRoundRectPosition() {
        new GuideCaseView.Builder(getAbility())
            .title("坐标聚焦")
            .focusRectAtPosition(600, 80, 800, 140)
            .roundRectRadius(60)
            .root(rootLayout)
            .build()
            .show();
    }

    public void focusWithBackgroundColor(Component view) {
        new GuideCaseView.Builder(getAbility())
            .focusOn(view)
            .root(rootLayout)
            .backgroundColor(new Color(Color.getIntColor("#CCff0000")))
            .title("背景颜色和文字样式都可以自定义")
            .titleStyle(ResourceTable.Pattern_MyTitleStyle, TextAlignment.TOP | TextAlignment.HORIZONTAL_CENTER)
            .build()
            .show();
    }

    public void noFocusAnimation(Component view) {
        new GuideCaseView.Builder(getAbility())
            .focusOn(view)
            .root(rootLayout)
            .disableFocusAnimation()
            .build()
            .show();
    }

    public void focusWithCustomAnimation(Component view) {
        AnimatorProperty enterAnimation = new AnimatorProperty();
        enterAnimation.alpha(1);
        AnimatorProperty exitAnimation = new AnimatorProperty();
        exitAnimation.alpha(0);
        final GuideCaseView guideCaseView = new GuideCaseView.Builder(getAbility())
            .focusOn(view)
            .title("自定义进入和退出动画")
            .root(rootLayout)
            .enterAnimation(enterAnimation)
            .exitAnimation(exitAnimation)
            .build();
        enterAnimation.setTarget(guideCaseView);
        exitAnimation.setTarget(guideCaseView);
        exitAnimation.setStateChangedListener(new Animator.StateChangedListener() {
            @Override
            public void onStart(Animator animator) {

            }

            @Override
            public void onStop(Animator animator) {

            }

            @Override
            public void onCancel(Animator animator) {

            }

            @Override
            public void onEnd(Animator animator) {
                guideCaseView.removeView();
            }

            @Override
            public void onPause(Animator animator) {

            }

            @Override
            public void onResume(Animator animator) {

            }
        });
        guideCaseView.show();
    }

    private GuideCaseView guideCaseView;

    public void focusWithCustomView(Component view) {
        guideCaseView = new GuideCaseView.Builder(getAbility())
            .focusOn(view)
            .root(rootLayout)
            .customView(ResourceTable.Layout_layout_custom_guide_case_view, view12 ->
                view12.findComponentById(ResourceTable.Id_btn_action_close)
                    .setClickedListener(view1 -> guideCaseView.hide()))
            .closeOnTouch(false)
            .build();
        guideCaseView.show();
    }

    @Override
    public void onClick(Component component) {
        switch (component.getId()) {
            case ResourceTable.Id_btn_nofocus:
                noFocus();
                break;
            case ResourceTable.Id_btn_rounded_rect:
                roundedRectFocus(component);
                break;
            case ResourceTable.Id_btn_large_circle:
                focusWithLargerCircle(component);
                break;
            case ResourceTable.Id_btn_rect_position:
                focusRoundRectPosition();
                break;
            case ResourceTable.Id_btn_background_color:
                focusWithBackgroundColor(component);
                break;
            case ResourceTable.Id_btn_no_anim:
                noFocusAnimation(component);
                break;
            case ResourceTable.Id_btn_custom_anim:
                focusWithCustomAnimation(component);
                break;
            case ResourceTable.Id_btn_custom_view:
                focusWithCustomView(component);
                break;
        }
    }
}
